<template>
  <!--系统配置-->
  <div class="h-full ">
    <n-card :bordered="false" class=".rounded-5px shadow-sm "
            :content-style="{height:'100%',paddingTop:'5px !important'}">
      <n-space vertical>
        <n-tabs
          type="line"
          animated
          placement="top"
          size="small"
          :tab-style="{fontSize:'1.1rem'}"
        >
          <n-tab-pane name="tab1" tab="">
            <template #tab>
              系统设置
            </template>
            <system-setting/>
          </n-tab-pane>
          <n-tab-pane name="tab4">
            <template #tab>
              存储设置
            </template>
            <storage-setting/>
          </n-tab-pane>
          <n-tab-pane name="tab2">
            <template #tab>
              微信设置
            </template>
              <wx-setting/>
          </n-tab-pane>
          <n-tab-pane name="tab99">
            <template #tab>
              工作流
            </template>
            <n-button @click="deploy">
              部署
            </n-button>
            <n-button @click="deleteModelHandle">
              删除
            </n-button>
            <n-button @click="clearHandle">
              清空
            </n-button>
          </n-tab-pane>
        </n-tabs>
      </n-space>
    </n-card>
  </div>
</template>

<script setup lang="tsx">

import StorageSetting from "@/views/system/setting/storage-setting.vue";
import SystemSetting from "@/views/system/setting/system-setting.vue";
import WxSetting from "@/views/system/setting/wx-setting.vue";


//富文本编辑器工具栏相关配置


//图片预览
// const showImgModal = ref<boolean>(false);
//图片预览地址
// const previewImageUrlRef = ref('')
//系统配置
// const ip_address = localStg.get("config.ip_address");


//部署流程
function deploy() {
  // deployment("").then(res => {
  //   console.log(res);
  // });
}

//删除模型
function deleteModelHandle() {
  // deleteModel({}).then(res => {
  //   console.log(res);
  // });
}

//清空所有流程和模型
function clearHandle() {
  // clearActiviti({}).then(res => {
  //   console.log(res);
  // });
}

//预览图片
// function handlePreview(file: UploadFileInfo) {
//   const {url} = file
//   previewImageUrlRef.value = url as string
//   showImgModal.value = true
// }

// const uploadRequest = ({file, data, options, onFinish}: UploadCustomRequestOptions) => {
//   const formData = new FormData()
//   if (data) {
//     Object.keys(data).forEach((key) => {
//       formData.append(
//         key,
//         data[key as keyof UploadCustomRequestOptions['data']]
//       )
//     })
//   }
//   formData.append("file", file.file as File);
//   fetch(actionUrl.value, {
//     method: 'POST',
//     body: formData,
//     headers: {
//       'Authorization': token.value || ''
//     }
//   }).then(res => {
//     return res.json()
//   }).then(res => {
//     console.log(res);
//     handleFinish({file, event: res})
//   })
// }

//上传图片完成后回调
// const handleFinish = ({file, event}: { file: UploadFileInfo, event?: ProgressEvent }) => {
//   const ext = file.name.split('.')[1]
//   file.name = `${file.name}.${ext}`;
//   file.url = config.url + event.data;
//   wxmpIndexImagesList.value.push(file);
//   return file;
// }

//删除图片
// const handleRemove = ({file, event}: { file: UploadFileInfo, fileList: Array<UploadFileInfo> }) => {
//   let newList: UploadFileInfo[] = [];
//   wxmpIndexImagesList.value.forEach((item: UploadFileInfo) => {
//     if (item.url !== file.url) {
//       newList.push(item);
//     }
//   });
//   wxmpIndexImagesList.value = newList;
// }

//创建
// function handleCreated(editor) {
//   editorRef.value = editor
// }


</script>

<style scoped>


:deep(.n-tabs-tab-pad) {
  height: 5px !important;
}
</style>
